<template>
  <div class="app-container">
    <CommonTable ref="commonTable" :qo="qo" :baba="this" async-load-entity-file-count>
      <!-- 查询参数 -->
      <template slot="filterItems">
        <el-form-item label="输入框" prop="keyword1">
          <el-input v-model.trim="qo.keyword1" clearable />
        </el-form-item>
        <el-form-item label="下拉1" prop="keyword2">
          <el-select v-model="qo.keyword2" filterable clearable placeholder="请选择订单状态">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="下拉2" prop="keyword3">
          <el-select v-model="qo.keyword3" filterable allow-create default-first-option clearable placeholder="请选择订单状态2">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="时间" prop="keyword4">
          <date-range-picker v-model="qo.keyword4" range-separator="到" />
        </el-form-item>
        <el-form-item label="显示作废" prop="keyword5">
          <el-checkbox v-model="qo.keyword5" />
        </el-form-item>
      </template>
      <!-- 列表头 -->
      <template slot="column">
        <el-table-column type="selection" width="55" />
        <el-table-column label="类型" prop="businessType" />
        <el-table-column label="订单号" prop="bookingNo" />
        <el-table-column label="订单日期" prop="bookingDate" />
        <el-table-column label="状态" prop="status" />
        <el-table-column label="供应商" prop="supplierName" />
        <el-table-column label="订单总金额" prop="totalAmount" />
        <el-table-column label="币种" prop="currency" />
        <el-table-column label="物流状态" prop="logisticsStatus">
          <template slot-scope="{row}">
            <el-link type="primary" @click="showOrderLogistics(row)">{{ row.logisticsStatus }}</el-link>
          </template>
        </el-table-column>
        <el-table-column label="关联文件" prop="fileCount">
          <template slot-scope="{ row }">
            <el-link v-show="row.fileCount && row.fileCount > 0" type="primary" @click="showFileWindow(row)">附件({{ row.fileCount }})</el-link>
          </template>
        </el-table-column>
      </template>
    </CommonTable>

    <!--附件窗口-->
    <SystemFileWindow ref="sfw" :zip="true" />

    <OrderLogisticsDialog ref="orderLogisticDialog" />
  </div>
</template>
<script>
import { orderList } from '@/api/hfy/escm'
import DateRangePicker from '@/components/DateRangePicker'
import SystemFileWindow from '@/components/SystemFileWindow'
import CommonTable from '@/components/CommonTable'
import OrderLogisticsDialog from '@/components/OrderLogisticsDialog'
export default {
  name: 'BookingOrderList',
  components: { CommonTable, DateRangePicker, SystemFileWindow, OrderLogisticsDialog },
  data() {
    return {
      qo: { keyword1: '', keyword2: '', keyword3: '', keyword4: [], keyword5: '' },
      options: [{ value: 1, label: '全部' }, { value: 2, label: '暂存' }, { value: 3, label: '受理中' }, { value: 4, label: '已受理' }]
    }
  },
  created() {
  },
  methods: {
    getData(qoPro) {
      return orderList(qoPro)
    },
    test(row) {
      this.$message.success({ message: '操作订单' + row.bookingNo })
    },
    batchTest() {
      this.$refs.commonTable.getSelectedRows().then(rows => {
        this.$message.success({ message: '操作' + rows.length + '条数据' })
      })
    },
    createOrder() {
      // 创建订单
      this.$router.push({ path: '/bookingOrder/create2' })
    },
    showFileWindow(row) {
      this.$refs.sfw.showFileList(row.id, row.bookingNo + ' 订单附件')
    },
    showOrderLogistics(row) {
      this.$refs.orderLogisticDialog.show(row.bookingNo)
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
